<template>
  <div class="header" >
    <div class="title">
      后台管理系统
    </div>
    <div class="header-nav">
      <!-- <span class="glyphicon glyphicon-align-justify" aria-hidden="true"></span>-->
      <div class="user-ctrl">
        <span>{{userName}}</span>
        <!--<a href="#">退出</a>-->
        <a @click="loginOut">退出</a>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "Header",
    data(){
      return{
        userName:null,
      }
    },
    mounted(){
      this.type = this.$route.query.type;
      //console.log(this.type);
      if( this.type !== "wpf" ){
        let user = sessionStorage.getItem("userSession");
        if( user ){
          this.userName = JSON.parse(user).userName;
        }else{
          this.$router.push({path:"/login"});
        }
      }

    },
    methods:{
      loginOut(){
        sessionStorage.setItem("userSession","");
        this.$router.push({path:"/login"});
      },
    }, // methods end
  }
</script>+

<style scoped>
.header-breadcrumb {
  position: relative;
  line-height: 40px;
  float: left;
  padding-left: 30px;
  color: #fff;
  cursor: pointer;
}
  .help-wrap {
    position: absolute;
    width: 200px;
    top: 36px;
    margin-left: -30px;
    padding: 4px 10px;
    text-align: left;
    font-size: 16px;
    line-height: 1.5;
    border-radius: 4px;
    background-color: #DCDFE6;
    color: #303133;
    z-index: 10;
  }
  .help-wrap:before{
     display: block;
     position: absolute;
     left: calc(50% - 42px);
     top: -6px;
     width: 0;
     height: 0;
     border-left: 8px solid transparent;
     border-right: 8px solid transparent;
     border-bottom: 6px solid #DCDFE6;
     content: "";
  }
  .help-doc {
    display: none;
  }
</style>
